<template>
    <div ref="content">
        {{ a }}
        <input type="text"  v-model="name">
        <div ref="qi">
           <label for="abc">请输入文本  <input placeholder="请输入文本"  type="text" v-model="nochange"></label>
         
        </div>
        {{ name }}
        <br>
        {{ nochange }}
        <br>
        {{ title }}
        <br>
        <!-- <el-button type="primary" @click="post">父子传值</el-button> -->
    </div>
</template>

<script setup lang="ts">
import { getCurrentInstance, onMounted, reactive, ref, watchEffect } from "vue"
import {useTestStore} from '@/store'

const props = defineProps({
    title:{
        type:String,
        defalut:''
    }
})

const test = useTestStore()
//test.current = 777
test.setCurrent()

console.log(test.current);

  //  console.log(props.title);
    
 
    const a:number = 12333
    const name = ref<string>('小强')
   // console.log(window)
    const nochange = ref<string>('sss')
    onMounted(()=>{
       const getCI  = getCurrentInstance()   //实例
       const q = getCI?.ctx.$refs.qi
      // console.log(q); 
    })
    const emit = defineEmits(['orange'])
    const post = ()=>{
        emit('orange','1122333')
    }

    watchEffect((before)=>{
        before(()=>{
            console.log('监听之前执行');  //触发监听之前执行.一上来不会立即触发
        })
        console.log(name.value);
    },{
        flush:'post', //有点像nexttick，dom更新后加载
        onTrigger(e) {
           // debugger    //debugger使用
        }
    })

    defineExpose({
        a
    })


</script>

<style lang="scss" scoped>

</style>